.error {
}

.disabled {
	opacity: 0.5;	
	filter: literal("alpha(opacity = 50)");
}

.focused {
}

.inactive {
}

.position-left {
	float:left;
}

.position-above {
	clear: both;
}

.astrix,
.label {
	display: block;
	float:left;
}

/* textbox */
.textbox,
.textbox .error {
	width: 100%;
	display: block;
	border: 1px solid #777474;
	height: 19px;
	line-height: 19px;
	padding: 2px;
}

.textbox.error {
	border: 1px solid #f32323;
}

@Sprite .textbox {
	gwt-image: "textBoxBackground";
	background-position: bottom;
}

.textbox-view-label {
	width: 100%;
	height: 20px;
	line-height: 20px;
	padding-left: 4px;
	padding-top: 3px;
	padding-bottom: 3px;
	
}
.textbox-view-label.error {
	line-height: 20px;
	height: 20px;
	padding-left: 3px;
	padding-top: 2px;
	padding-bottom: 2px;
	padding-right: -2px;
	border: 1px solid #b70000;
}

/** gray 48 button **/
.simple-button,
.simple-button .simple-button-inner,
.simple-button .simple-button-inner-text
{
	display:inline-block;
	width:auto;
	line-height: 23px;
	height:23px;
	cursor:pointer;
	outline: none;
}
	/* Left area */
	.simple-button
	{
		padding-left:7px;
	}
	@Sprite .simple-button
	{
		gwt-image:"flowButtonLeftDown";
		background-position:left top;
		background-repeat:no-repeat;
	}
	
	@Sprite .simple-button.inactive
	{
		gwt-image:"flowButtonLeftIdle";
		background-position:left top;
		background-repeat:no-repeat;
	}
	
	@Sprite .simple-button:hover.inactive,
	.simple-button.focused.inactive
	{
		gwt-image:"flowButtonLeftHover";
		background-position:left top;
		background-repeat:no-repeat;
	}
	
	/* Mid area */
	@Sprite .simple-button .simple-button-inner-text
	{
		gwt-image:"flowButtonMidDown";
	}
	
	@Sprite .simple-button.inactive .simple-button-inner-text
	{
		gwt-image:"flowButtonMidIdle";
	}
	
	@Sprite .simple-button:hover.inactive .simple-button-inner-text,
	.simple-button.focused.inactive .simple-button-inner-text
	{
		gwt-image:"flowButtonMidHover";
	}
	
	/* Right area */
	.simple-button .simple-button-inner
	{
		padding-right:7px;
	}
	@Sprite .simple-button .simple-button-inner
	{
		gwt-image:"flowButtonRightDown";
		background-position:right top;
		background-repeat:no-repeat;
	}
	
	@Sprite .simple-button.inactive .simple-button-inner
	{
		gwt-image:"flowButtonRightIdle";
		background-position:right top;
		background-repeat:no-repeat;
	}
	
	@Sprite .simple-button:hover.inactive .simple-button-inner,
	.simple-button.focused.inactive .simple-button-inner
	{
		gwt-image:"flowButtonRightHover";
		background-position:right top;
		background-repeat:no-repeat;
	}

/** green button **/
.green-button,
.green-button .green-button-inner,
.green-button .green-button-inner-text
{
	display:inline-block;
	width:auto;
	line-height: 25px;
	height:25px;
	cursor:pointer;
	outline: none;
}
	/* Left area */
	.green-button
	{
		padding-left:2px;
	}
	@Sprite .green-button
	{
		gwt-image:"greenButtonLeftDown";
		background-position:left top;
		background-repeat:no-repeat;
	}
	
	@Sprite .green-button.inactive
	{
		gwt-image:"greenButtonLeftIdle";
		background-position:left top;
		background-repeat:no-repeat;
	}
	
	@Sprite .green-button:hover.inactive,
	.green-button.focused.inactive
	{
		gwt-image:"greenButtonLeftHover";
		background-position:left top;
		background-repeat:no-repeat;
	}
	
	/* Mid area */
	@Sprite .green-button .green-button-inner-text
	{
		gwt-image:"greenButtonMidDown";
		padding-right: 6px;
		padding-left: 6px;
	}
	
	@Sprite .green-button.inactive .green-button-inner-text
	{
		gwt-image:"greenButtonMidIdle";
		padding-right: 6px;
		padding-left: 6px;
	}
	
	@Sprite .green-button:hover.inactive .green-button-inner-text,
	.green-button.focused.inactive .green-button-inner-text
	{
		gwt-image:"greenButtonMidHover";
		padding-right: 6px;
		padding-left: 6px;
	}
	
	/* Right area */
	.green-button .green-button-inner
	{
		padding-right:2px;
	}
	@Sprite .green-button .green-button-inner
	{
		gwt-image:"greenButtonRightDown";
		background-position:right top;
		background-repeat:no-repeat;
	}
	
	@Sprite .green-button.inactive .green-button-inner
	{
		gwt-image:"greenButtonRightIdle";
		background-position:right top;
		background-repeat:no-repeat;
	}
	
	@Sprite .green-button:hover.inactive .green-button-inner,
	.green-button.focused.inactive .green-button-inner
	{
		gwt-image:"greenButtonRightHover";
		background-position:right top;
		background-repeat:no-repeat;
	}


/** red button **/
.red-button,
.red-button .red-button-inner,
.red-button .red-button-inner-text
{
	display:inline-block;
	width:auto;
	line-height: 25px;
	height:25px;
	cursor:pointer;
	outline: none;
}
	/* Left area */
	.red-button
	{
		padding-left:2px;
	}
	@Sprite .red-button
	{
		gwt-image:"redButtonLeftDown";
		background-position:left top;
		background-repeat:no-repeat;
	}
	
	@Sprite .red-button.inactive
	{
		gwt-image:"redButtonLeftIdle";
		background-position:left top;
		background-repeat:no-repeat;
	}
	
	@Sprite .red-button:hover.inactive,
	.red-button.focused.inactive
	{
		gwt-image:"redButtonLeftHover";
		background-position:left top;
		background-repeat:no-repeat;
	}
	
	/* Mid area */
	@Sprite .red-button .red-button-inner-text
	{
		gwt-image:"redButtonMidDown";
		padding-right: 6px;
		padding-left: 6px;
	}
	
	@Sprite .red-button.inactive .red-button-inner-text
	{
		gwt-image:"redButtonMidIdle";
		padding-right: 6px;
		padding-left: 6px;
	}
	
	@Sprite .red-button:hover.inactive .red-button-inner-text,
	.red-button.focused.inactive .red-button-inner-text
	{
		gwt-image:"redButtonMidHover";
		padding-right: 6px;
		padding-left: 6px;
	}
	
	/* Right area */
	.red-button .red-button-inner
	{
		padding-right:2px;
	}
	@Sprite .red-button .red-button-inner
	{
		gwt-image:"redButtonRightDown";
		background-position:right top;
		background-repeat:no-repeat;
	}
	
	@Sprite .red-button.inactive .red-button-inner
	{
		gwt-image:"redButtonRightIdle";
		background-position:right top;
		background-repeat:no-repeat;
	}
	
	@Sprite .red-button:hover.inactive .red-button-inner,
	.red-button.focused.inactive .red-button-inner
	{
		gwt-image:"redButtonRightHover";
		background-position:right top;
		background-repeat:no-repeat;
	}


/** blue button **/
.blue-button,
.blue-button .blue-button-inner,
.blue-button .blue-button-inner-text
{
	display:inline-block;
	width:auto;
	line-height: 25px;
	height:25px;
	cursor:pointer;
	outline: none;
}
	/* Left area */
	.blue-button
	{
		padding-left:2px;
	}
	@Sprite .blue-button
	{
		gwt-image:"blueButtonLeftDown";
		background-position:left top;
		background-repeat:no-repeat;
	}
	
	@Sprite .blue-button.inactive
	{
		gwt-image:"blueButtonLeftIdle";
		background-position:left top;
		background-repeat:no-repeat;
	}
	
	@Sprite .blue-button:hover.inactive,
	.blue-button.focused.inactive
	{
		gwt-image:"blueButtonLeftHover";
		background-position:left top;
		background-repeat:no-repeat;
	}
	
	/* Mid area */
	@Sprite .blue-button .blue-button-inner-text
	{
		gwt-image:"blueButtonMidDown";
		padding-right: 6px;
		padding-left: 6px;
	}
	
	@Sprite .blue-button.inactive .blue-button-inner-text
	{
		gwt-image:"blueButtonMidIdle";
		padding-right: 6px;
		padding-left: 6px;
	}
	
	@Sprite .blue-button:hover.inactive .blue-button-inner-text,
	.blue-button.focused.inactive .blue-button-inner-text
	{
		gwt-image:"blueButtonMidHover";
		padding-right: 6px;
		padding-left: 6px;
	}
	
	/* Right area */
	.blue-button .blue-button-inner
	{
		padding-right:2px;
	}
	@Sprite .blue-button .blue-button-inner
	{
		gwt-image:"blueButtonRightDown";
		background-position:right top;
		background-repeat:no-repeat;
	}
	
	@Sprite .blue-button.inactive .blue-button-inner
	{
		gwt-image:"blueButtonRightIdle";
		background-position:right top;
		background-repeat:no-repeat;
	}
	
	@Sprite .blue-button:hover.inactive .blue-button-inner,
	.blue-button.focused.inactive .blue-button-inner
	{
		gwt-image:"blueButtonRightHover";
		background-position:right top;
		background-repeat:no-repeat;
	}




/* tab button */
.tab-button {
	display:inline-block;
	width:230px;
	height:89px;
	cursor:pointer;
	outline: none;
}

	@Sprite .tab-button {
		gwt-image: "tabButtonSelected"
	}
	
	@Sprite .tab-button.inactive {
		gwt-image: "tabButtonIdle"
	}
	
	@Sprite .tab-button:hover.inactive,
			.tab-button.focused.inactive {
		gwt-image: "tabButtonHover"
	}

/* tab button */
.tab-small-button {
	display:inline-block;
	width:230px;
	height:89px;
	cursor:pointer;
	outline: none;
}

	@Sprite .tab-small-button {
		gwt-image: "tabSmallButtonSelected"
	}
	
	@Sprite .tab-small-button.inactive {
		gwt-image: "tabSmallButtonIdle"
	}
	
	@Sprite .tab-small-button:hover.inactive,
			.tab-small-button.focused.inactive {
		gwt-image: "tabSmallButtonHover"
	}


/* combobox button */
.combobox-button-container,
.combobox-button,
.combobox-button-inner,
.combobox-button .combobox-button-inner-text
{
	display:inline-block;
	width:auto;
	line-height: 23px;
	height:23px;
	cursor:pointer;
	outline: none;
}
.combobox-button {
	padding-right: 21px;
}
	@Sprite .combobox-button.inactive {
		gwt-image:"comboboxButtonIdle";
		background-position:right top;
		background-repeat:no-repeat;
	}
	@Sprite .combobox-button {
		gwt-image:"comboboxButtonDown";
		background-position:right top;
		background-repeat:no-repeat;
	}
	
	@Sprite .combobox-button:hover.inactive,
			.combobox-button.focused.inactive {
		gwt-image:"comboboxButtonHover";
		background-position:right top;
		background-repeat:no-repeat;
	}
@Sprite .combobox-button .combobox-button-inner-text {
	gwt-image:"comboboxButtonBackground";
	padding-right: 5px;
	padding-left: 5px;
}

@Sprite .combobox-button .combobox-button-inner {
	gwt-image:"comboboxButtonBackground";
	background-repeat:repeat-x;
	width: 100%;
}

.combobox-button-container.error {
	border: 1px solid #f32323;
}
.combobox-button-container {
	border: 1px solid #777474;
}

.combobox-button-view {
	height: 24px;
	line-height: 24px;
	padding-left: 6px;
	padding-right: 5px;
	padding-top: 1px;
	cursor: pointer;
}
	
.combobox-button-view.error {
	height: 22px;
	line-height: 22px;
	padding-left: 5px;
	padding-right: 5px;
	border: 1px solid #f32323;
	cursor: pointer;
}

/* iterable list */

.iterable-list {
	border: 1px solid #777474;
	background-color: #f6f6f6;
	outline: none;
}

.iterable-list-idle-item,
.iterable-list-selected-item,
.iterable-list-highlighted-item {
	margin: 3px;
	padding: 2px;
}
.iterable-list-idle-item {

}

.iterable-list-selected-item {
/*	border: 1px solid #777474;*/
}

.iterable-list-highlighted-item {
	background-color: #dbdbdb;
}

/* AutoPosition Panel */
@external .gwt-PopupPanel;
.gwt-PopupPanel {
	z-index: 2500000;	
}
 
.auto-position-panel-popup.gwt-PopupPanel {
	outline: 0;
	border: 0;
	padding: 0;
	background: none;
	position: absolute;
	z-index: 250000;
}

.auto-position-panel-container {
	outline: 0;
	height: auto;
	width: auto;
	background: white;
	z-index: 250000;
}

.auto-position-panel-hoverpanel {
	outline: 0;
}

/* checkbox view */
.checkbox-container {
}
.checkbox-container.error {
	border: 1px solid #f32323;
}
.checkbox-view-checked,
.checkbox-view-unchecked {
	height: 9px;
	width: 9px;
	margin: 5px;
}
@Sprite .checkbox-view-checked {
	gwt-image: "checkboxViewChecked";
}

@Sprite .checkbox-view-unchecked {
	gwt-image: "checkboxViewUnchecked";
}


/* tapered box */
.tapered-box
{
	padding:1px 0;
	position:relative;
}
	@Sprite .tapered-box-tl
	{
		gwt-image:"taperedBoxTL";
		width:17px;
		height:19px;
		position:absolute;
		top:0;
		left:0;	
	}
	@Sprite .tapered-box-t
	{
		gwt-image:"taperedBoxTop";
		position:absolute;
		top:0;
		left:17px;
		right:17px;
		height:10px;	
	}
	
	@Sprite .tapered-box-r
	{
		gwt-image:"taperedBoxRight";
		position:absolute;
		top:19px;
		bottom: 19px;
		right:0;
		width:10px;	
	}
	
	@Sprite .tapered-box-l
	{
		gwt-image:"taperedBoxLeft";
		position:absolute;
		top:19px;
		bottom: 19px;
		left:0;
		width:10px;	
	}
	
	@Sprite .tapered-box-tr
	{
		gwt-image:"taperedBoxTR";
		position:absolute;
		top:0;
		right:0;
		width:17px;
		height:19px;
	}	
	@Sprite .tapered-box-br
	{
		gwt-image:"taperedBoxBR";
		position:absolute;
		bottom:0;
		right:0;
		width:17px;
		height:19px;
	}
	@Sprite .tapered-box-b
	{
		gwt-image:"taperedBoxBottom";
		position:absolute;
		bottom:0;
		left:17px;
		right:17px;
		height:10px;	
	}	
	@Sprite .tapered-box-bl
	{
		gwt-image:"taperedBoxBL";
		position:absolute;
		bottom:0;
		left:0;
		width:17px;
		height:19px;
	}
	.tapered-box-container
	{	
		background:none repeat scroll 0 0 #EDEDED;
		height:auto;
		margin:9px 10px;
		padding:12px;
		position:relative;
		width:auto;
	}

/* styled list item */
.styled-list-item {
	border-bottom: 1px solid #dbdbdb;
	margin-bottom: 3px;
}


/* x button */
@Sprite .x-button {
	gwt-image: "smallX";
	cursor: pointer;
	outline: none;
	width: 7px;
	height: 7px;
}
